<template>
    <div id="teamPage">
        <div style="text-align: right; margin: 10px">
            <van-button type="primary" @click="doJoinTeam">创建队伍</van-button>
        </div>
        <MyTeamCardList :team-list="teamList" />
        <van-empty image="search" description="暂无数据" v-if="!teamList || teamList.length < 1" />
    </div>
</template>

<script setup lang="ts">

import router from '../router'
import { onMounted, ref } from 'vue'
import myAxios from '../plugins/myAxios.ts'
import { showFailToast } from 'vant'
import MyTeamCardList from '../components/MyTeamCardList.vue'

const doJoinTeam = () => {
    router.push("/team/add")
}

const teamList = ref([]);

onMounted(async () => {
    try {
        const res = await myAxios.get("/team/my/list")
        if (res['code'] === 0) {
            teamList.value = res.data;
        } else {
            showFailToast("队伍信息获取失败")
        }
    } catch (error) {
        console.log("队伍信息获取失败", error);
        showFailToast("队伍信息获取失败")
    }
})

</script>

<style scoped>
#teamPage {

}
</style>